<!-- by 75 27 18 920 -->
<!-- 运费单 -->
<template>
    <a-row :gutter="24">
      <a-col :md="24">
        <a-card :style="cardStyle" :bordered="false">
          <!-- 查询区域 -->
          <div class="table-page-search-wrapper">
            <!-- 搜索区域 -->
            <a-form layout="inline" @keyup.enter.native="searchQuery">
              <!-- 供应商 -->
              <a-col :md="6" :sm="24">
                <a-form-item :label="$t('manuManagement.supplier')" :labelCol="labelCol" :wrapperCol="wrapperCol">
                  <a-select :placeholder="$t('manuManagement.selectSupplier')" showSearch optionFilterProp="children"
                    v-model="queryParam.organId">
                    <a-select-option v-for="(item, index) in supList" :key="index" :value="item.id">
                      {{ item.supplier }}
                    </a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-row :gutter="24">
                <!-- 单据编号 -->
                <a-col :md="6" :sm="24">
                  <a-form-item :label="$t('setailManagement.documentNo')" :labelCol="labelCol" :wrapperCol="wrapperCol">
                    <a-input :placeholder="$t('manuManagement.pleaseEnterTheDocumentNumber')"
                      v-model="queryParam.billNo"></a-input>
                  </a-form-item>
                </a-col>
                <!-- 单据日期 -->
                <a-col :md="6" :sm="24">
                  <a-form-item :label="$t('manuManagement.documentDate')" :labelCol="labelCol" :wrapperCol="wrapperCol">
                    <a-range-picker style="width:100%" v-model="queryParam.createTimeRange" format="YYYY-MM-DD"
                      :placeholder="[$t('manuManagement.startTime'), $t('manuManagement.endTime')]" @change="onDateChange"
                      @ok="onDateOk" />
                  </a-form-item>
                </a-col>
                <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                  <a-col :md="6" :sm="24">
                    <a-button type="primary" @click="searchQuery">{{ $t('manuManagement.query') }}</a-button>
                    <a-button style="margin-left: 8px" @click="searchReset">{{ $t('manuManagement.reset') }}</a-button>
                    <a @click="handleToggleSearch" style="margin-left: 8px">
                      {{ toggleSearchStatus ? $t('manuManagement.putAway') : $t('manuManagement.open') }}
                      <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
                    </a>
                  </a-col>
                </span>
                <template v-if="toggleSearchStatus">
                  <a-col :md="6" :sm="24">
                    <a-form-item :label="$t('financialManagement.financialStaff')" :labelCol="labelCol"
                      :wrapperCol="wrapperCol">
                      <a-select :placeholder="$t('financialManagement.selectPersonnel')" showSearch
                        optionFilterProp="children" v-model="queryParam.handsPersonId">
                        <a-select-option v-for="(item, index) in personList" :key="index" :value="item.id">
                          {{ item.name }}
                        </a-select-option>
                      </a-select>
                    </a-form-item>
                  </a-col>
                  <a-col :md="6" :sm="24">
                    <a-form-item :label="$t('setailManagement.operator')" :labelCol="labelCol" :wrapperCol="wrapperCol">
                      <a-select :placeholder="$t('setailManagement.seletOperator')" showSearch optionFilterProp="children"
                        v-model="queryParam.creator">
                        <a-select-option v-for="(item, index) in userList" :key="index" :value="item.id">
                          {{ item.userName }}
                        </a-select-option>
                      </a-select>
                    </a-form-item>
                  </a-col>
                  <a-col :md="6" :sm="24">
                    <a-form-item :label="$t('financialManagement.collectionAccount')" :labelCol="labelCol"
                      :wrapperCol="wrapperCol">
                      <a-select :placeholder="$t('financialManagement.selectCollection')" showSearch
                        optionFilterProp="children" v-model="queryParam.accountId">
                        <a-select-option v-for="(item, index) in accountList" :key="index" :value="item.id">
                          {{ item.name }}
                        </a-select-option>
                      </a-select>
                    </a-form-item>
                  </a-col>
                  <a-col :md="6" :sm="24">
                    <a-form-item :label="$t('manuManagement.documentStatus')" :labelCol="labelCol"
                      :wrapperCol="wrapperCol">
                      <a-select :placeholder="$t('manuManagement.status')" v-model="queryParam.status">
                        <a-select-option value="0">{{ $t('manuManagement.notApproved') }}</a-select-option>
                        <a-select-option value="1">{{ $t('manuManagement.reviewed') }}</a-select-option>
                      </a-select>
                    </a-form-item>
                  </a-col>
                  <a-col :md="6" :sm="24">
                    <a-form-item :label="$t('setailManagement.notesToDocuments')" :labelCol="labelCol"
                      :wrapperCol="wrapperCol">
                      <a-input :placeholder="$t('setailManagement.pleaseEnterTheNotesOfTheDocument')"
                        v-model="queryParam.remark"></a-input>
                    </a-form-item>
                  </a-col>
                </template>
              </a-row>
            </a-form>
          </div>
          <!-- 操作按钮区域 -->
          <div class="table-operator" style="margin-top: 5px">
            <a-button v-if="btnEnableList.indexOf(1) > -1" @click="myHandleAdd" type="primary" icon="plus">{{
                $t('manuManagement.newlyAdded')
            }}</a-button>
          <ColumnsSetting @columnsChange="columnsChange" :columns="columns"></ColumnsSetting>
            <a-dropdown>
              <a-menu slot="overlay">
                <a-menu-item key="1" v-if="btnEnableList.indexOf(1) > -1" @click="batchDel"><a-icon type="delete" />{{
                    $t('manuManagement.delete')
                }}</a-menu-item>
                <!-- <a-menu-item key="2" v-if="btnEnableList.indexOf(2)>-1" @click="batchSetStatus(1)"><a-icon type="check"/>{{$t('manuManagement.toExamine')}}</a-menu-item>
                <a-menu-item key="3" v-if="btnEnableList.indexOf(7)>-1" @click="batchSetStatus(0)"><a-icon type="stop"/>{{$t('manuManagement.DeApproval')}}</a-menu-item> -->
              </a-menu>
              <a-button>
                {{ $t('manuManagement.batchOperation') }} <a-icon type="down" />
              </a-button>
            </a-dropdown>
            <a-tooltip placement="left" :title="$t('financialManagement.thePayment')" slot="action">
              <a-icon v-if="btnEnableList.indexOf(1) > -1" type="question-circle" style="font-size:20px;float:right;" />
            </a-tooltip>
            <a-button v-if="btnEnableList.indexOf(5) > -1"  style="margin-left: 8px" v-print="'#reportPrint'" icon="printer">{{$t('reportQuery.print')}}</a-button>
          <a-button v-if="btnEnableList.indexOf(5) > -1"  style="margin-left: 8px" @click="generatePrintData" icon="printer">{{$t('inPrint.other') + $t('reportQuery.print')}}</a-button>
        </div>
        <!-- table区域-begin -->
        <section ref="print" id="reportPrint">
            <a-table :customRow="rowClick" ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
              :pagination="ipagination" :scroll="scroll" :loading="loading"
              :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" @change="handleTableChange">
              <span slot="action" slot-scope="text, record">
                <!-- <a @click="myHandleDetail(record, $t('purchasingManagement.FreightList'))">{{ $t('manuManagement.check')
                }}</a>
                <a-divider v-if="btnEnableList.indexOf(1) > -1" type="vertical" /> -->
                  <a-popconfirm :ok-text="$t('popup.determine')" :cancel-text="$t('inPrint.cancel')" v-if="btnEnableList.indexOf(7)>-1 && record.status !== '0'" :title="$t('popup.confirmReverseAudit')" @confirm="() => myHandleReverseAudit(record)">
                <a type="link">
                  {{$t('manuManagement.DeApproval')}}
                </a>
              </a-popconfirm>
              <a v-if="btnEnableList.indexOf(7)>-1 && record.status === '0'" type="link" :disabled="record.status === '0'">{{$t('manuManagement.DeApproval')}}</a>
              <a-divider v-if="btnEnableList.indexOf(7) > -1" type="vertical" />
                <a v-if="btnEnableList.indexOf(1) > -1" @click="myHandleEdit(record)">{{ $t('manuManagement.edit') }}</a>
                <a-divider v-if="btnEnableList.indexOf(1) > -1" type="vertical" />
                <a-popconfirm v-if="btnEnableList.indexOf(1) > -1" :title="$t('manuManagement.areDelete')"
                  @confirm="() => myHandleDelete(record)">
                  <a>{{ $t('manuManagement.delete') }}</a>
                </a-popconfirm>
              </span>
              <template slot="customRenderStatus" slot-scope="status">
                <a-tag v-if="status == '0'" color="red">{{ $t('manuManagement.notApproved') }}</a-tag>
                <a-tag v-if="status == '1'" color="green">{{ $t('manuManagement.reviewed') }}</a-tag>
              </template>
              <template slot="reviewProgress" slot-scope="text, record">
                <a @click="openReviewProgress(record)" v-if="text==1">{{ $t('purchasingManagement.ReviewProgressStep1') }}</a>
                <a @click="openReviewProgress(record)" v-if="text==2">{{ $t('purchasingManagement.ReviewProgressStep2') }}</a>
                <span v-if="text === undefined">-</span>
              </template>
            </a-table>
        </section>
        <!-- table区域-end -->
          <!-- 表单区域 -->
          <TransportOrderModal ref="modalForm" @ok="modalFormOk"></TransportOrderModal>
          <FinancialDetail ref="modalDetail"></FinancialDetail>
          <!-- <FreightBillDetail ref="modalDetail"></FreightBillDetail> -->
          <review-progress ref="reviewProgress"></review-progress>
        </a-card>
      </a-col>
    </a-row>
  </template>
  <script>
  import TransportOrderModal from '@/views/bill/modules/TransportOrderModal'
  // import FreightBillDetail from './dialog/FreightBillDetail'
  import FinancialDetail from './dialog/FinancialDetail'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import { FinancialListMixin } from './mixins/FinancialListMixin'
  import ReviewProgress from '../bill/dialog/ReviewProgress.vue'
  import JDate from '@/components/jeecg/JDate'
  import Vue from 'vue'
  export default {
    name: "VerificationChecks",
    mixins: [JeecgListMixin, FinancialListMixin],
    components: {
      // FreightBillDetail,
      FinancialDetail,
      TransportOrderModal,
      JDate,
      ReviewProgress
    },
    data() {
      return {
        labelCol: {
          span: 5
        },
        wrapperCol: {
          span: 18,
          offset: 1
        },
        // 查询条件
        queryParam: {
          billNo: "",
          searchMaterial: "",
          type: '运费',
          organId: "",
          creator: "",
          handsPersonId: "",
          accountId: "",
          status: "",
          remark: "",
          roleType: Vue.ls.get('roleType')
        },
        // 表头
        columns: [
          {
            title: this.$t('defaultTranslate.lineNumber'), dataIndex: 'rowIndex', width:60, align:"center",
            customRender: (t,r,index) => (t !== '合计') ? (parseInt(index) + 1) : t
          },
          { title: this.$t('manuManagement.supplier'), dataIndex: 'organName', width: 140, ellipsis: true },
          { title: this.$t('manuManagement.documentNo'), dataIndex: 'billNo', width: 160 },
          { title: this.$t('manuManagement.documentDate'), dataIndex: 'billTimeStr', width: 160 },
          { title: this.$t('manuManagement.operator'), dataIndex: 'loginName', width: 80, ellipsis: true },
          { title: this.$t('manuManagement.totalFreight'), dataIndex: 'totalPrice', width: 80 },
          // { title: this.$t('financialManagement.preferentialAmount'), dataIndex: 'discountMoney', width: 80 },
          { title: this.$t('financialManagement.actualPayment'), dataIndex: 'changeAmount', width: 80 },
          { title: this.$t('purchasingManagement.ReviewProgress'), dataIndex: 'process', width: 60, align: 'center', scopedSlots: { customRender: 'reviewProgress' } },
          { title: this.$t('financialManagement.remarks'), dataIndex: 'remark', width: 100 },
          {
            title: this.$t('manuManagement.state'), dataIndex: 'status', width: 80, align: "center",
            scopedSlots: { customRender: 'customRenderStatus' }
          },
          {
            title: this.$t('manuManagement.operation'),
            dataIndex: 'action',
            width: 200,
            align: "center",
            scopedSlots: { customRender: 'action' },
          }
        ],
        url: {
          list: "/accountHead/list",
          delete: "/accountHead/delete",
          deleteBatch: "/accountHead/deleteBatch",
          deApprovalUrl:'/workflowConfigProcess/deApproval',
          batchSetStatusUrl: "/accountHead/batchSetStatus"
        }
      }
    },
    computed: {
    },
    created() {
      console.log(this.columns,222);
      this.initSupplier()
      this.initUser()
      this.initPerson()
      this.initAccount()
    },
    methods: {
      rowClick(record, index) {
        return {
          on: {
            click: () => {
            },
            dblclick: () => {
              console.log('双击了我')
              this.myHandleDetail(record, this.$t('purchasingManagement.FreightList'))
            },
          }
        }
      },
      openReviewProgress (record) {
        this.$refs.reviewProgress.show(record, 'billNo')
      }
    }
  }
  </script>
  <style scoped>
  
  </style>